/*
 * @Author: guoyangf
 * @Date: 2020-07-09 15:27:07
 * @LastEditTime: 2020-08-06 13:55:02
 * @Description: file content
 */

import React, { Component } from 'react';
import { base, toast, DongbaToLocalTime } from 'nc-lightapp-front'
const { NCModal, NCDiv, NCTable } = base;
import { requestPromise } from 'ssccommon/utils/asyncFunctions.js';
import dataFormat from 'ssccommon/utils/dataFormat';
import moment from 'moment';
import './index.less';

class HistoryCtrl extends Component {

    constructor(props) {
        super(props);
        this.state = {
            multiLang: {},
            isShow: false,
            // sscTaskHistoryTpl: [], //操作记录NCTable模板
            sscTaskHistoryData: [], //操作记录NCTable数据
            optHistoryExpandRowKeys: {}, //操作记录中已经展开的行的key
        }
        this.multiLangPromise = window.__SSC_MultiLangPromise;
        if (this.multiLangPromise) {
            this.multiLangPromise.then((multiLang) => {
                this.setState({
                    multiLang
                })
            })
        }
    }

    genTpl = () => {
        let multiLang = { ...this.state.multiLang, ...this.props.multiLang };
        let tpl = this.props.tpl || { items: [] };
        let sscTaskHistoryTpl = [{
            title: multiLang['job-common-xh'], /*序号*/
            dataIndex: 'index',
            key: 'index',
            width: '60px',
            render(text, record, index) {
                return index + 1
            }
        }];
        tpl.items.forEach((item) => {
            if (item.visible) {
                sscTaskHistoryTpl.push(
                    {
                        title: <div fieldid={item.attrcode}>{item.label}</div>,
                        dataIndex: item.attrcode,
                        key: item.attrcode,
                        width: item.width,
                        render: (text, record, index) => {
                            return <div className="ellipsis" fieldid={item.attrcode} title={text}>{text || <span>&nbsp;</span>}</div>
                        }
                    }
                );
            }
        })
        sscTaskHistoryTpl.push(
            {
                title: <div fieldid='opt'>{multiLang['job-common-cz']}</div>, /* 操作 */
                dataIndex: "opt",
                key: "opt",
                width: 100,
                fixed: "right",
                render: (text, record, index) => {
                    let optHistoryExpandRowKeys = this.state.optHistoryExpandRowKeys;
                    let key = record['pk_bill'] + '_' + index;
                    let hasKey = optHistoryExpandRowKeys[key];
                    let isShowBtn = false;
                    switch (record.values['actiontype'].value) {
                        //case 'handon':
                        case 'sscapprove':
                        case 'sscreject':
                            isShowBtn = true;
                    }
                    return isShowBtn
                        ?
                        (
                            <div
                                fieldid='view'
                                onClick={
                                    () => {
                                        if (hasKey) {
                                            delete optHistoryExpandRowKeys[key]
                                        } else {
                                            optHistoryExpandRowKeys[key] = true;

                                        }
                                        this.setState({
                                            optHistoryExpandRowKeys
                                        });
                                    }
                                } style={{ color: '#0073e1', cursor: 'pointer' }}
                            >
                                {hasKey ? multiLang['job-common-ycwtmx'] : multiLang['job-common-xswtmx']} {/* 隐藏问题明细  显示问题明细 */}
                            </div>
                        )
                        :
                        null
                }
            }
        )
        return sscTaskHistoryTpl
    }

    componentDidUpdate(prevProps) {
        /* if(this.props.isShow != this.state.isShow) {
            this.setState({
                isShow: this.props.isShow
            })
        } */
    }
    show = () => {
        this.setState({
            isShow: true
        })
    }

    

    dateFormat = (value) => {
        let { _i } = DongbaToLocalTime(moment(value))
        if (_i) {
            value = moment(_i).format('YYYY-MM-DD HH:mm:ss');
        }
        return dataFormat(value, 'datetime');
    }


    query = async (data, url) => {
        try {
            const result = await requestPromise({
                url: this.props.queryUrl || `/nccloud/ssctp/sscbd/SSCTaskHandleQueryOperationAction.do`,
                data: data
            });
            if (result.success && result.data.ssctaskhistory) {
                let newRows = result.data.ssctaskhistory.rows.map((row, index) => {
                    let values = row.values;
                    let newRow = { values };
                    for (let attrcode in values) {
                        if (attrcode != 'opt') {
                            let val = values[attrcode].display || values[attrcode].value;
                            //操作时间格式支持模板配置
                            if (attrcode == 'operatetime') {

                                val = this.dateFormat(values[attrcode].display || values[attrcode].value);
                            }
                            newRow[attrcode] = val;
                        }
                    }
                    newRow.key = values['pk_bill'].value + '_' + index;
                    return newRow
                })
                this.setState({
                    sscTaskHistoryData: newRows,
                    isShow: true
                })
            }
            this.setState({
                isShow: true
            })
        } catch (e) {
            toast({ title: e.message, duration: 5, color: 'danger', })
        }
    }
    render() {
        let multiLang = this.state.multiLang;
        let sscTaskHistoryTpl = this.genTpl()
        return (
            <NCModal
                fieldid="operate-record"
                className="operate-note"
                show={this.state.isShow}
                onHide={() => this.setState({ isShow: false })}
                size='lg'
            >
                <NCModal.Header closeButton>
                    <NCModal.Title>{this.props.title || multiLang['job-common-czjl']}</NCModal.Title>{/*操作记录*/}
                </NCModal.Header>
                <NCModal.Body>
                    <NCDiv fieldid="history-opt" className="operate-note-body-div" areaCode={NCDiv.config.TABLE}>
                        <NCDiv fieldid="history-opt" areaCode={NCDiv.config.TableCom}>
                            <NCTable
                                columns={sscTaskHistoryTpl}
                                data={
                                    this.state.sscTaskHistoryData
                                }
                                expandedRowKeys={Object.keys(this.state.optHistoryExpandRowKeys)}
                                expandedRowRender={(record) => {
                                    let problems = [];
                                    if (record.problems) {
                                        problems = record.problems.map((item, index) => {
                                            return (
                                                <li className='opt_history_li' fieldid="history-detail">
                                                    <div className='opt_history_name_wrap'>
                                                        {index + 1}.&nbsp;{item.displayname}
                                                        <span className={`opt_history_level pro-${item.serious_level_code}`}>
                                                            {item.serious_level_name}
                                                        </span>
                                                    </div>
                                                    <div class='opt_history_memo'>{item.memo}</div>
                                                </li>
                                            )
                                        })
                                    }
                                    return problems.length ?
                                        (
                                            <ul className='opt_history_ul'>
                                                {problems}
                                            </ul>
                                        )
                                        :
                                        (<span fieldid="history-detail">{multiLang['job-common-wwtmx']}</span>) /*无问题明细*/
                                }}
                            />

                        </NCDiv>
                    </NCDiv>
                </NCModal.Body>
            </NCModal>
        )
    }
}

export default HistoryCtrl;